<template>
  <div class="font">
    <div style="display: flex;justify-content: space-between">
      <div style="margin-top: 10px">

        <el-button type="primary" icon="el-icon-plus" @click="showDialogVisible">添加讲座信息</el-button>
      </div>

      <div>

      </div>
    </div>

    <div style="margin-top: 10px">
      <el-table
          v-loading="loading"
          element-loading-text="加载中........"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.8)"
          :data="lectureinfos"
          border
          stripe
          style="width: 90%;font-size: 15px"
          height="500">
        <!--          type="selection"-->
        <el-table-column

            width="55">
        </el-table-column>

        <el-table-column
            fixed="left"
            prop="id"
            label="讲座编号"
            width="70">
        </el-table-column>
        <el-table-column
            prop="name"
            label="讲座名"
            width="120">
        </el-table-column>
        <el-table-column
            prop="address"
            label="讲座地址"
            width="120">
        </el-table-column>
        <el-table-column
            prop="totalNumbers"
            label="讲座座位总数"
            width="120">
        </el-table-column>
        <el-table-column
            prop="remainNumbers"
            label="讲座座位剩余数量"

            width="120">
        </el-table-column>
        <el-table-column
            prop="beginDate"
            label="讲座开始时间"
            width="280">
        </el-table-column>
        <el-table-column
            prop="endDate"
            label="讲座结束时间"
            width="280">
        </el-table-column>

      </el-table>
      <el-pagination
          background
          @current-change="currentChange"
          @size-change="sizeChange"
          layout="sizes, prev, pager, next, jumper, ->, total"
          :page-sizes="[5, 10, 15,20,50,100,200,500]"
          :total="total"
      >

      </el-pagination>
    </div>
    <el-dialog
        :title="dialogTitle"
        :visible.sync="dialogVisible"
        width="50%">

      <div>
        <el-form ref="addForm" :rules="rules" :model="addLectureInfo" label-width="80px">
          <el-form-item label="讲座名称" prop="name">
            <el-input v-model="addLectureInfo.name" placeholder="请输入讲座名称"></el-input>
          </el-form-item>
          <el-form-item label="讲座地址" prop="address">
            <el-select v-model="addLectureInfo.address" placeholder="请选择讲座地址">
              <el-option label="公一#109" value="公一#109"></el-option>
              <el-option label="公一#110" value="公一#110"></el-option>
              <el-option label="公一#111" value="公一#111"></el-option>
              <el-option label="公一#112" value="公一#112"></el-option>
              <el-option label="公一#113" value="公一#113"></el-option>
              <el-option label="公一#114" value="公一#114"></el-option>
              <el-option label="公一#115" value="公一#115"></el-option>
              <el-option label="公一#116" value="公一#116"></el-option>
            </el-select>

          </el-form-item>
          <el-form-item label="讲座时间" prop="endDate">
            <el-col :span="11">
              <el-date-picker type="datetime" placeholder="选择开始时间"
                              format="yyyy-MM-ddTHH:mm:ss"
                              v-model="addLectureInfo.beginDate" style="width: 100%;"></el-date-picker>
            </el-col>
            <el-col class="line" :span="2">-</el-col>

            <el-col :span="11">
              <el-date-picker type="datetime" placeholder="选择结束时间"
                              format="yyyy-MM-ddTHH:mm:ss"
                              v-model="addLectureInfo.endDate" style="width: 100%;"></el-date-picker>
            </el-col>
          </el-form-item>


          <el-form-item label="座位数量" prop="totalNumbers">

              <el-radio v-model="addLectureInfo.totalNumbers" label="30" >30</el-radio>
              <el-radio v-model="addLectureInfo.totalNumbers" label="60">60</el-radio>
              <el-radio v-model="addLectureInfo.totalNumbers" label=80>80</el-radio>
              <el-radio v-model="addLectureInfo.totalNumbers" label="120">120</el-radio>
              <el-radio v-model="addLectureInfo.totalNumbers" label=200>200</el-radio>

          </el-form-item>
          <el-form-item label="剩余数量" prop="remainNumbers">
            <el-input v-model="addLectureInfo.remainNumbers"
                      :disabled="disabled1"
                      type="number" placeholder="请输入座位剩余数量" >
            </el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="doAddLectureInfo">确 定</el-button>
  </span>
    </el-dialog>
    <el-dialog
        title="高级搜索"
        :visible.sync="dialogVisible1"
        width="50%">

      <div>
        <el-form ref="searchForm" :model="searchLectureInfo" label-width="80px">
          <el-form-item label="讲座名称">
            <el-input v-model="searchLectureInfo.name" placeholder="根据讲座名称搜索"></el-input>
          </el-form-item>
          <el-form-item label="讲座地址">
            <el-input v-model="searchLectureInfo.address" placeholder="根据讲座地址搜索"></el-input>
          </el-form-item>

          <el-form-item label="剩余数量" >
            <el-input v-model="searchLectureInfo.remainNumbers" type="number" placeholder="请输入座位剩余数量" >
            </el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible1 = false">取 消</el-button>
    <el-button type="primary" @click="doSeachLectureInfo">确 定</el-button>
  </span>
    </el-dialog>

  </div>
</template>

<script>
import {downloadRequest} from "@/utils/download";

export default {
  name: "BasicAddLectureInfo",
  data() {
    return {
      rules: {

        name: [
          { required: true, message: "请输入讲座名称", trigger: "blur" },
        ],
        address: [{ required: true, message: "请选择讲座地址", trigger: "blur" }],
        endDate: [{ required: true, message: "请选择时间", trigger: "blur" }],
        totalNumbers: [{ required: true, message: "请输入座位数量", trigger: "blur" }],

      },
      disabled1:true,
      searchLectureInfo:{
        name: '',
        address: '',
        remainNumbers: '',
        beginDate: '',
      },
      dialogVisible1:false,
      headers: {
        Authorization: window.sessionStorage.getItem("tokenStr"),
      },
      importDataBtnIcon:'el-icon-upload2',
      importDataBtnText:'导入数据',
      importDataDisabled:false,

      dialogTitle:'',
      addLectureInfo:{
        id:null,
        name: '',
        address: '',
        totalNumbers: '',
        remainNumbers: '',
        beginDate: '',
        endDate: ''
      },

      dialogVisible:false,
      total:0,
      page:'',
      currentPage:1,
      size:10,
      loading: false,
      lectureinfos: [],
      keywords:'',
      totalNumbers: '',

    }
  },
  mounted() {//页面加载时就会初始化的数据
    this.initLectureInfo();
  },
  methods: {
    doSearch1()
    {

      this.dialogVisible1=true;
    },
    onSuccess()
    {
      this.importDataBtnIcon='el-icon-upload2';
      this.importDataBtnText='导入数据';
      this.initLectureInfo();
    },
    onError()
    {
      this.importDataBtnIcon='el-icon-upload2';
      this.importDataBtnText='导入数据';
    },
    beforeUpload(){
      this.importDataBtnIcon='el-icon-loading';
      this.importDataBtnText='正在导入';
      this.importDataDisabled=true;
    },
    downloadInfo()
    {
      this.downloadRequest('/system/LectureInfoManagement/downloads/');
    },
    showUpdateLectureInfoView(data)
    {
      this.disabled1=false;
      this.dialogTitle='修改讲座信息';
      this.dialogVisible=true;
      this.addLectureInfo=data;

    },
    deleteLectureInfo(data) {
      this.$confirm("此操作将删除[" + data.name + "]讲座信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
          .then(() => {
            this.deleteRequest("/system/LectureInfoManagement/delete?id=" + data.id).then(
                (resp) => {
                  if (resp) {
                    this.initLectureInfo();
                  }
                }
            );
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除",
            });
          });
    },

    doAddLectureInfo()
    {
      if(this.addLectureInfo.id)
      {
        this.$refs["addForm"].validate((valid) => {
          if (valid) {
            this.putRequest("/system/LectureInfoManagement/update", this.addLectureInfo).then((resp) => {
              if (resp) {
                this.dialogVisible = false;
                this.initLectureInfo();
              }
            });
          }
        });
      }
      else {
        this.$refs["addForm"].validate((valid) => {
          if (valid) {
            this.addLectureInfo.remainNumbers=this.addLectureInfo.totalNumbers;
            this.postRequest("/system/LectureInfoManagement/addLectureInfo/add", this.addLectureInfo).then(
                (resp) => {
                  if (resp) {
                    this.dialogVisible = false;
                    this.initLectureInfo();
                  }
                }
            );
            console.log(this.addLectureInfo);
          }
        });
      }




    },


    showDialogVisible()
    {
      this.addLectureInfo={
        id:null,
        name: '',
        address: '',
        totalNumbers: '',
        remainNumbers: '',
        beginDate: '',
        endDate: ''
      },
          this.dialogTitle='添加讲座信息';
      this.dialogVisible=true;
    },
    sizeChange(size)
    {
      this.size=size;
      this.initLectureInfo();
    },
    currentChange(currentPage){
      this.currentPage=currentPage;
      this.initLectureInfo();

    },
    doSeachLectureInfo(){
      this.loading = true;
      this.getRequest('/system/LectureInfoManagement/getLectureInfoByPage/list?currentPage='
          +this.currentPage+'&size='+this.size+'&name='+this.searchLectureInfo.name+
          '&address='+this.searchLectureInfo.address+
          '&remainNumbers='+this.searchLectureInfo.remainNumbers).then(resp => {
        if (resp) {
          this.lectureinfos = resp.data;
          this.total=resp.total;
          this.loading = false;
          this.dialogVisible1=false;
        }
      })

    },

    doSearch() {
      this.initLectureInfo();
    },
    initLectureInfo() {
      this.loading = true;
      this.getRequest('/system/LectureInfoManagement/getLectureInfoByPage/list?currentPage='
          +this.currentPage+'&size='+this.size+'&name='+this.keywords).then(resp => {
        if (resp) {
          this.lectureinfos = resp.data;
          this.total=resp.total;
          this.loading = false;
        }
      })

    }
  }

}
</script>

<style scoped>

</style>